import 'package:flutter/material.dart';
import 'package:core_package/core_package.dart';

import 'my_separator_widget.dart';

class SelectTitleAndDetailWidget extends StatelessWidget {
  final String? title;
  final String? detail;
  final bool showBottomLine;
  final bool bottomLineIsSeparator;
  final double? height;
  final double? titleWidth;
  final Function()? onTap;
  final Widget? icon;
  final TextStyle? titleStyle;
  final TextStyle? detailStyle;

  const SelectTitleAndDetailWidget({
    Key? key,
    @required this.title,
    @required this.detail,
    this.showBottomLine = true,
    this.bottomLineIsSeparator = true,
    this.onTap,
    this.titleWidth,
    this.height,
    this.icon,
    this.titleStyle,
    this.detailStyle,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      behavior: HitTestBehavior.opaque,
      onTap: () {
        if (onTap != null) onTap?.call();
      },
      child: Column(
        children: [
          Row(
            children: [
              Container(
                width: titleWidth ?? 80.px,
                height: height ?? 40.px,
                alignment: Alignment.centerLeft,
                child: Text(
                  title ?? "",
                  style: titleStyle ??
                      TextStyle(
                        color: MyColors.formHex("#272727FF"),
                        fontSize: MyFont.font14,
                        fontWeight: MyFontWeight.regular,
                      ),
                ),
              ),
              Expanded(
                child: Text(
                  detail ?? '',
                  style: detailStyle ??
                      TextStyle(
                        color: MyColors.formHex("#272727FF"),
                        fontWeight: MyFontWeight.regular,
                        fontSize: MyFont.font14,
                      ),
                ),
              ),
              icon ?? SizedBox(),
              MySizeBox(width: 10.px),
            ],
          ),
          Offstage(
            offstage: !showBottomLine,
            child: Row(children: [
              SizedBox(width: titleWidth ?? 80.px),
              Expanded(
                  child: bottomLineIsSeparator
                      ? MySeparator(color: MyColors.color_238_238_238)
                      : Divider(height: 1, color: MyColors.color_238_238_238)),
            ]),
          )
        ],
      ),
    );
  }
}
